<template>
    <div>
      <el-button type="primary" @click="opendialog">点击打开弹窗</el-button>
      <el-button type="primary" @click="opennotice">消息通知组件</el-button>
    </div>
</template>

<script setup>
import { useMessage } from '@/hooks/useMessage';
const {ElMessage,ElMessageBox,ElNotification}=useMessage();
//点击打开弹窗事件
const opendialog=async ()=>{
   const results=await ElMessageBox.confirm(
    '删除之后数据不可恢复,你真的要删除这一条数据吗?',
    '警告弹窗',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  ).catch(err=>err);
  // console.log(results);
  if(results=='confirm'){
     ElMessage({type: 'success', message: '删除成功'})
  }else{
     ElMessage({type: 'info', message: '你取消了本次删除操作'})
  }  
}
const opennotice=()=>{
  ElNotification({
    title: 'Custom Position',
    message: "I'm at the top left corner",
    position: 'top-left',
  })
}
</script>

<style lang="scss" scoped>

</style>